{% extends 'basic/component.html' %}
{#{% extends '_layout/base.html' %}#}
{% load i18n %}
{% load static %}

{% block pageTitle %}
  {% trans 'Explore' %}
{% endblock %}

{% block pageHeadExtra %}
  <link href="{% static 'css/modal-dialog.css' %}" rel="stylesheet">
  <link href="{% static 'css/main.css' %}" rel="stylesheet">
  <link rel="stylesheet" href="{% static 'css/search/results.css' %}">
    <link rel="stylesheet" href="{% static 'css/search/collapse.css' %}">
{#    <link rel="stylesheet" href="{% static 'css/basic/header_footer.css' %}">#}
{#    <link rel="stylesheet" href="{% static 'css/basic/index.css' %}">#}
{#    <link href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">#}
  <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap-select/1.12.4/css/bootstrap-select.min.css">
  <script src="https://cdn.bootcss.com/bootstrap-select/1.12.4/js/bootstrap-select.min.js"></script>
{#    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">#}
{% endblock %}

{% block pageBody %}
{#      {% include 'basic/header.html' %}#}
{#  <div class="dividing-large"></div>#}
  <div class="container">
{#    {% if error_detail %}#}
{#      <p style="width: 100%;color: red; text-align: center; margin-top: 3px">#}
{#        {% trans 'Bad query string, please try again' %} &nbsp;({{ error_detail }})#}
{#      </p>#}
{#    {% endif %}#}
    <div class="row">
        <div class="col-lg-offset-1 col-lg-10 col-md-offset-1 col-md-10 col-sm-12 col-xs-12">
          <div class="input-group input-group-lg">
            <div class="input-group-btn input-group-lg">
              <select id="query-type" class="btn-group-lg selectpicker show-menu-arrow show-tick"
                      data-width="auto">
                <option value="title">{% trans 'Title' %}</option>
                <option value="author">{% trans 'Author' %}</option>
                <option value="keywords">{% trans 'Keywords' %}</option>
                <option value="abstract">{% trans 'Abstract' %}</option>
                <option value="doi">DOI</option>
                <option value="purpose">{% trans 'Purpose' %}</option>
                <option value="full" selected="selected">{% trans 'Full Text' %}</option>
              </select>
            </div>
            <input id="com-search-text" type="text" class="form-control"
                   placeholder="{% trans 'Search for' %}...">
            <span class="input-group-btn">
            <button id="com-search-btn" class="btn btn-default" type="button">
              <i class="fa fa-search"></i>{% trans 'Search' %}</button>
          </span>
          </div>
        </div>
    </div>{# div row #}

    <div class="col-lg-12 col-md-12" id="con_result">
        <div class="dividing-large"></div>
        <div class="col-lg-2 col-md-2 hidden-xs hidden-sm">
            <div id="leftnav">
                <div class="leftnav_item">
                    <div id="year" data-author="year">
                        <h4 id="section-5" class="una text-left animated fadeInLeft" data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
                            <a class="leftnav_t" onclick="Hide(collapseOne,hidediv1)"><i class="c-icon c-icon-arrow-up-gray" id="hidediv1" style="float: right"></i>{% trans 'Time'%}</a>
                        </h4>
                    </div>
                    <div id="collapseOne" class="panel-collapse collapse in">
                        <div class="leftnav_list leftnav_year_list leftnav_list_show">
                            <div class="leftnav_list_cont" id="nav_year">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="leftnav_item">
                    <div id="categroy" data-author="categroy">
                        <h4 id="section-5" class="una text-left animated fadeInLeft" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">
                            <a class="leftnav_t" onclick="Hide(collapseTwo,hidediv2)"><i class="c-icon c-icon-arrow-up-gray" id="hidediv2" style="float: right"></i>{% trans 'Category'%}</a>
                        </h4>
                    </div>
                    <div id="collapseTwo" class="panel-collapse collapse in">
                        <div class="leftnav_list leftnav_list_show left_list_short">
                            <div class="leftnav_list_cont" id="nav_categroy">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="leftnav_item">
                    <div id="author" data-author="author">
                        <h4 id="section-5" class="una text-left animated fadeInLeft" data-toggle="collapse" data-parent="#accordion" href="#collapseThree">
                            <a class="leftnav_t" onclick="Hide(collapseThree,hidediv3)"><i class="c-icon c-icon-arrow-up-gray" id="hidediv3" style="float: right"></i>{% trans 'Author'%}</a>
                        </h4>
                    </div>
                    <div id="collapseThree" class="panel-collapse collapse in">
                        <div class="leftnav_list leftnav_list_show left_list_short" style="height: 99px;">
                            <div class="leftnav_list_cont" id="nav_author">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>{# div col-2 #}
        <div class="col-lg-10 col-md-10">
            <div class="d-result-info">
                <div class="horizontal statistic small">
                    <div id="result-count" class="value">{{ total }}</div>
                    <div class="label">{% trans 'Results' %}</div>
                </div>
                <div class="pull-right">
                    {% trans 'Sort by' %}
                    <select id="sort-order" class="selectpicker show-menu-arrow show-tick" data-width="auto">
                        <option value="desc">{% trans 'Descending' %}</option>
                        <option value="asc">{% trans 'Ascending' %}</option>
                    </select>
                    <button id="sort-btn" class="btn btn-primary" style="width: 80px">{% trans 'Sort' %}</button>
                </div>
            </div>
            <div id="root-con">
                <div id="dm-scope" style="clear: both;">
                </div>
                <div style="text-align: center">
                    <ul id="paginator"></ul>
                </div>
            </div>
        </div>{# div col-10 #}
    </div>{# div con_result #}

    <div class="col-lg-12 col-md-12" id="hot_result">
        <div class="dividing-large"></div>
        <div class="col-lg-1 col-md-1 hidden-xs hidden-sm">
        </div>
        <div class="col-lg-10 col=md-10">
            <div class="">
                <div id="description">
                    {% trans 'Show you the data browsed more times in the past week:' %}
                    <br>
                    <br>
                </div>
                <div id="hot-scope">
                </div>
            </div>
        </div>
        <div class="col-lg-1 col-md-1 hidden-xs hidden-sm">
        </div>
    </div>

  </div>{# div container #}

{#  {% include '_component/corner-buttons.html' %}#}
{#  {% include '_component/fast-feedback.html' %}#}
{#  {% include '_component/shopping-cart.html' %}#}
{#  {% include '_component/modal-dialog-overlay.html' %}#}

{% endblock %}

{% block pageFootExtra %}
  <script src="{% static 'js/vendor/bootstrap-paginator.js' %}"></script>
  <script src="{% static 'js/vendor/jquery.base64.js' %}"></script>
  <script src="{% static 'js/search/results.js' %}"></script>
{% endblock %}